<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<meta charset="UTF-8">
	<title>后台管理系统</title>
	<link rel="stylesheet" type="text/css" th:href="@{/css/system_login.css(version=${fileVersion})}">
</head>
<body>
	<div class="header">
		<label th:text="${projectName}+'后台管理系统'"></label>
	</div>
	<div class="container">
		<div class="content">
			<div id="login" class="form">
				<form th:action="@{/system_login}" method="post" th:object="${loginUser}">
					<div class="login-header">
						<h1>用户登录</h1>
					</div>
					<div th:class="${#fields.hasAnyErrors()} ? 'msg msg-error' : 'msg msg-info'">
						<label></label>
						<span th:each="err,state : ${#fields.allErrors()}" th:text="${state.last} ? ${err} : ${err}+','"></span>
					</div>
					<div th:class="${#fields.hasErrors('loginname')} ? 'item item-error' : 'item'">
			  			<label class="login-label name"></label>
			  			<input type="text" th:field="*{loginname}" class="itxt" placeholder="请输入用户名">
					</div>
					<div th:class="${#fields.hasErrors('password')} ? 'item item-error' : 'item'">
			  			<label class="login-label pwd"></label>
			  			<input type="password" th:field="*{password}" class="itxt" placeholder="请输入密码">
					</div>
					<div th:class="${#fields.hasErrors('imagecode')} ? 'item code item-error' : 'item code'">
			  			<label class="login-label pwd"></label>
			  			<input type="text" id="imagecode" th:field="*{imagecode}" class="itxt" placeholder="请输入验证码">
			  			<img id="imgcode" th:src="@{/getimagecode(_=${T(java.lang.Math).random()})}" width="100" height="35" title="点击刷新验证码"/>
					</div>
					<input type="submit" class="btn" value="登&nbsp;&nbsp;录">
				</form>
			</div>
		</div>
	</div>
	<div id="service_baseurl" style="display:none;" th:data-page-url="${#request.contextPath}+' '"></div>
	<script th:src="@{/jquery/{version}/jquery.js(version=${jqueryVersion})}"></script>
	<script th:inline="none">
	$(function(){
		var pageurl = $("#service_baseurl").attr("data-page-url").trim();
		$("#imgcode").click(function(){
			var $img = $(this);
			$img.attr('src', pageurl+'/getimagecode?_='+Math.random());
		});
		var $login = $("#login");
		$("input.itxt", $login).each(function(){
			var $input = $(this);
			$input.focusin(function(){
				$input.parent().toggleClass('item-info');
			}).focusout(function(){
				$input.parent().toggleClass('item-info');
				if($input.val().length>0) {
					$input.parent().removeClass('item-error');
				}
			});
		});
	});
	</script>
</body>
</html>